<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">

    <title>验证码</title>
    <style>
        #inputCaptcha {
            height: 30px;
            vertical-align: middle;
        }
        #verificationCodeImg{
            vertical-align: middle;
        }
        #checkCaptcha{
            height: 40px;
            width: 100px;
        }
    </style>
</head>

<body>
<h1>输入验证码</h1>
<div id="confirm">
    <input type="text" name="inputCaptcha" id="inputCaptcha">
    <img id="verificationCodeImg" src="/admin/captcha" style="cursor: pointer;" title="看不清？换一张" />
    <input type="button" value="提交" id="checkCaptcha">
</div>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script>

    $("#verificationCodeImg").click(function(){
        $(this).hide().attr('src', '/admin/captcha?dt=' + new Date().getTime()).fadeIn();
    });

    $("#checkCaptcha").click(function () {
        $.ajax({
            type:"get",
            url:"/admin/check",
            data:{
                captcha:$("#inputCaptcha").val()
            },
            success:function(result){
                if(result){
                     alert("验证成功")
                    // location.assign("success.html");
                }else{
                    alert("验证码错误");
                }
            }
        });
        
    });

</script>
</body>

</html>